<template>
    <el-form :model="alarmContactsForm" :rules="rules" ref="alarmContactsForm" label-width="120px" class="demo-alarmContactsForm">
            <el-form-item label="组名" prop="name">
              <el-input v-model="alarmContactsForm.name"></el-input>
            </el-form-item>
            <el-form-item label="备注" prop="description">
              <el-input v-model="alarmContactsForm.description"></el-input>
            </el-form-item>
            <el-form-item label="选择联系人" prop="transfer">
                <el-transfer 
                  filterable
                 :left-default-checked="[2, 3]" 
                 :right-default-checked="[1]" 
                 :footer-format="{
                    noChecked: '共${total}项',
                    hasChecked: '已选${checked}/${total} 项'
                  }"
                 :titles="['已有联系人', '已选联系人']"  
                 v-model="selectAlarmContactIds" 
                 :data="AlarmContactData"> 
                </el-transfer>
            </el-form-item>
            <el-form-item >
              <el-button type="primary" class="madesure" @click="sure('alarmContactsForm')" >确定</el-button>
            </el-form-item>
    </el-form>
    
     
</template>
<script>
import { getAlarmContactsAllList } from '@/api/alarmRulesData'
export default {
  name: 'agroup',
  props: ['msg'],
  data() {
    const generateData = _ => {
      const data = []
      getAlarmContactsAllList().then(response => {
        if (response.data.code === 0) {
          console.log(response.data.data, 'ffffff')
          response.data.data.forEach(function(element) {
            data.push({
              key: element.id,
              label: element.name
            })
          }, this)
        }
      })
      return data
    }
    return {
      alarmContactsForm: {
        transfer: '',
        name: 'name',
        description: 'description'
      },
      rules: {
        name: [
          { required: true, message: '请输入组名', trigger: 'blur' },
          { min: 1, max: 50, message: '长度在 1 到 50 个字符', trigger: 'blur' }
        ]
      },
      AlarmContactData: generateData(),
      selectAlarmContactIds: this.msg
    }
  },
  methods: {
    sure(form) {
      console.log(this.alarmContactsForm, 'test')
      this.alarmGroupdialog = true
    }
  }
}
</script>
<style lang="scss">
.madesure{
    position: absolute;
    right: 90px;
    bottom: -97px;
}
</style>

